<template>
	<view>
		<view class="mui-content">
			<view class="top3">
				<view style="height: 50px;position: relative;border-bottom: 0.5rpx #ecdede solid;">
					<input type="text" placeholder="手机号" @blur="onPhone" class="ren">
				</view>
				<view style="height: 50px;position: relative;border-bottom: 0.5rpx #ecdede solid;">
					<input type="text" placeholder="昵称" v-model="nick" disabled class="ren">
				</view>
				<view style="height: 50px;position: relative;border-bottom: 0.5rpx #ecdede solid;">
					<input type="number" placeholder="积分" v-model="jifen" class="suo">
				</view>
				<view style="height: 50px;position: relative;border-bottom: 0.5rpx #ecdede solid;">
					<input type="password" placeholder="支付密码" v-model="password" class="suo">
				</view>
			</view>
			<button class="top" @click="zhuanchu()">确定转出</button>
			<button class="top" @click="jifenRecord()">积分记录</button>
			<button class="top" @click="shopRecord()">购物记录</button>
			<u-modal v-model="show" :content="content"></u-modal>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				phone:'',		//手机号
				nick:'',		//昵称
				jifen:'',		//积分
				password:'',	//支付密码
				show: false,	//模态框是否显示
				content: '转出成功'
			}
		},
		methods: {
			zhuanchu(){
				let reg = /^1[0-9]{10}$/;
				if (!reg.test(this.phone)) {
					this.$u.toast("请输入正确的手机号!");
					return
				}
				if(this.nick==null || this.nick==""){
					this.$u.toast("用户不存在!");
					return
				}
				let num = /^[0-9]*$/;
				if(!num.test(this.jifen)){
					this.$u.toast("积分只能是数字!");
					return
				}
				if(this.jifen<0){
					this.$u.toast("积分必须大于0!");
					return
				}
				if(this.password==""){
					this.$u.toast("支付密码不能为空!");
					return
				}
				this.$http.get('/jifen.do',{
					p:'jifenZhuanchuxcx',
					userid:uni.getStorageSync('usersId'),
					tel:this.phone,
					jifen:this.jifen,
					password:this.password
				}).then(res => {
					if(res.data=="success"){
						this.show = true;
					}else{
						this.$u.toast(res.data);
					}
				})
			},
			jifenRecord(){
				uni.navigateTo({
					url:'jifenRecord'
				})
			},
			shopRecord(){
				uni.navigateTo({
					url:'shopRecord'
				})
			},
			onPhone(e){
				this.phone = e.target.value;
				if(this.phone.length<1){
					this.$u.toast("手机号不能为空")
				}else{
					let reg = /^1[3456789]\d{9}$/;
					if(!reg.test(this.phone)){
						this.$u.toast("请输入有效的手机号")
					}
				}
				//根据手机号码获取昵称
				this.$http.get('/jifen.do',{
					p:'getNameByTelxcx',
					tel:this.phone
				}).then(res => {
					if(res.data.code==200){
						this.nick = res.data.msg;
					}
				})
			},
			// onJifen(e){
			// 	this.jifen = e.target.value;
			// },
			// onPassword(e){
			// 	this.password = e.target.value;
			// }
		}
	}
</script>

<style>
	.top3 {
		margin-top: 8%;
		width: 90%;
		margin-left: 5%;
	}
	.top {
		background: #EF6700;
		width: 90%;
		height: 45px;
		color: lightgray;
		text-align: center !important;
		margin-top: 8%;
		margin-left: 5%;
		font-size: 140%;
		font-weight: bold;
		line-height: 40px;
	}
	.ren{
		border: 0.5rpx #ecdede solid;
		background-color: white;
		height: 50px;
		padding-left: 40px;
		background-image: url(../../static/center/login_name.png);
		background-size: 20px;
		background-repeat: no-repeat;
		background-position-x: 10px;
		background-position-y: 15px;
	}
	.suo{
		border: 0.5rpx #ecdede solid;
		background-color: white;
		height: 50px;
		padding-left: 40px;
		background-image: url(../../static/center/login_password.png);
		background-size: 20px;
		background-repeat: no-repeat;
		background-position-x: 10px;
		background-position-y: 15px;
	}
</style>
